<template>
  <div class="home" ref="homePage">
    <swipe class="home-swiper"  :speed="400" :auto="10000" :showIndicators="false" :loop="true">
      <swipe-item>
        <bm-swipe-one v-if="flag" :total="total" :clientHeight="clientHeight" :clientWidth="clientWidth"></bm-swipe-one>
      </swipe-item>
      <swipe-item>
        <bm-swipe-two v-if="flag" :total="total" :clientHeight="clientHeight" :clientWidth="clientWidth"></bm-swipe-two>
      </swipe-item>
    </swipe>
  </div>
</template>

<script>
import { Swipe, SwipeItem } from 'vue-swipe'
import bmSwipeOne from 'src/component/bmSwipeOne'
import bmSwipeTwo from 'src/component/bmSwipeTwo'
import {getHistoryData} from 'src/api/api'

require('vue-swipe/dist/vue-swipe.css')
export default {
  data() {
    return {
      clientHeight: '',
      clientWidth: '',
      total: {
        totalCount: '--',
        totalPrice: '--',
        bmqAllCount: '--',
        xjAllCount: '--',
        bmqAllPrice: '--',
        xjAllPrice: '--',
        bmqConnt: '--',
        xfbCount: '--',
        jfCount: '--',
        registerCount: '--',
        RealAuthenticationCount: '--',
        sellCount: '--',
        historyBuyAgainCount: '--',
        firstBuyAgainCount: '--'
      },
      flag: false
    }
  },
  created() {
    this._getHistoryData()
    setInterval(() => {
      setTimeout(() => {
        this._getHistoryData()
      }, 0)
    }, 5 * 60 * 1000)
    // this.$axios({
    //   method: 'post',
    //   url: 'http://60.191.59.19:7001/bm-mobile/Common.do?method=execute&SessionAppKey=',
    //   params: {
    //     PassWay: 'GET',
    //     SessionAppKey: '',
    //     TransId: 'report/querySecondDataOne'
    //   }
    // }).then(res => {
    //   console.log(res)
    // })
  },
  mounted() {
    // 获取浏览器可视区域高度
    this.clientHeight = `${document.documentElement.clientHeight}` // document.body.clientWidth;
    this.clientWidth = `${document.documentElement.clientWidth}` // document.body.clientWidth;
    window.onresize = () => {
      this.clientHeight = `${document.documentElement.clientHeight}`
      this.clientWidth = `${document.documentElement.clientWidth}`
    }
  },
  methods: {
    _getHistoryData() {
      getHistoryData().then(res => {
        if (res.status === '0') {
          this.total = res.result.data[0]
          this.flag = true
        }
      })
    },
    changeFixed(clientHeight, clientWidth) { // 动态修改样式
      this.$refs.homePage.style.height = clientHeight + 'px'
      // this.$refs.homePage.style.width = clientWidth + 'px'
    }
  },
  watch: {
    // 如果 `clientHeight` 发生改变，这个函数就会运行
    clientHeight: function () {
      this.changeFixed(this.clientHeight, this.clientWidth)
    }
  },
  components: {
    Swipe,
    SwipeItem,
    bmSwipeOne,
    bmSwipeTwo
  }
}
</script>

<style lang="scss">
.home {
 .mint-swipe, .mint-swipe-items-wrap {
   overflow: auto;
 }
}
</style>

